<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<section>
    <div class="row">
        <div class="col-sm-12">
            <div class="media u-academic pr">
                <aside class="media-left vam">
                    <em class="account-ico u-i-baseTj-ico account-ico-3"></em>
                </aside>
                <section class="media-body">
                    <div class="hLh30 txtOf"><span class="fs16 c-333">密码</span></div>
                    <span class="fs14 c-000 hLh20 show mt10">********</span>
                </section>
                <a href="javascript:void(0);" class="pa academicBtn">
                    <button class="btn btn-info btn-rounded btn-outline" id="newUpdatePassWordBtn"  type="button">修改密码</button>
                </a>
            </div>
            <div class="media u-academic pr">
                <aside class="media-left vam  mobileNewIcon" th:classappend="${user['mobile']}!=null and ${user['mobile']}!='' ? 'bind':''">
                    <em class="account-ico u-i-baseTj-ico account-ico-4"></em>
                </aside>
                <input    th:value="${user['mobile']}" name="mobile" type="hidden">
                <section class="media-body">
                    <div class="hLh30 txtOf">
                        <span class="fs16 c-333" id="bindMobileEd">
                            <span th:if="${#strings.isEmpty(user['mobile'])}">绑定手机</span>
                            <span th:if="!${#strings.isEmpty(user['mobile'])}">手机号 已绑定</span>
                        </span>
                    </div>
                    <span class="fs14 c-000 hLh20 show mt10 mobileNewBtn">
                        <span th:if="${#strings.isEmpty(user['mobile'])}"  class="fs14 c-999 hLh20 show mt10">绑定的登录手机号</span>
                        <span th:if="!${#strings.isEmpty(user['mobile'])}" th:text="${user['mobile']}"></span>
                    </span>
                </section>
                <a href="javascript:void(0);" class="pa academicBtn">
                    <button class="btn btn-info btn-rounded btn-outline" id="bindMobileBtn" type="button">
                        <span th:if="${#strings.isEmpty(user['mobile'])}">绑定手机</span>
                        <span th:if="!${#strings.isEmpty(user['mobile'])}">修改绑定</span>
                    </button>
                </a>
            </div>
            <div class="media u-academic pr">
                <aside class="media-left vam emailNewIcon" th:classappend="!${#strings.isEmpty(user['email'])} ? 'bind':''">
                    <em class="account-ico u-i-baseTj-ico account-ico-5"></em>
                </aside>
                <section class="media-body">
                    <div class="hLh30 txtOf"><span class="fs16 c-333" id="bindMailEd">
                           <span th:if="${#strings.isEmpty(user['email'])}">绑定邮箱</span>
                            <span th:if="!${#strings.isEmpty(user['email'])}">邮箱 已绑定</span>
                    </span></div>
                    <input  th:value="${user['email']}" name="email" type="hidden">
                    <span class="fs14 c-000 hLh20 show mt10 emailNewBtn">
                        <span th:if="${#strings.isEmpty(user['email'])}"  class="fs14 c-999 hLh20 show mt10">绑定登录邮箱号</span>
                        <span th:if="!${#strings.isEmpty(user['email'])}" th:text="${user['email']}"></span>
                    </span>
                </section>
                <a href="javascript:void (0);" class="pa academicBtn">
                    <button class="btn btn-info btn-rounded btn-outline" id="bindMailBtn" type="button">
                        <span th:if="${#strings.isEmpty(user['email'])}">绑定邮箱</span>
                        <span th:if="!${#strings.isEmpty(user['email'])}">修改绑定</span>
                    </button>
                </a>
            </div>
        </div>
    </div>
</section>

<!--验证弹邮箱出框 结构 开始-->
<div id="achangeEle1" class="hide">
    <div class="mt20 ml20 mr20">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">原邮箱</label>
                <div class="col-sm-8">
                    <input class="form-control" id="email1" disabled="disabled" th:value="${user['email']}" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">验证码</label>
                <div class="col-sm-5">
                    <input class="form-control" id="codeEmail1"  type="text">
                </div>
                <section class="col-sm-3">
                    <button type="button" id="sendUnBindingEmailCode" class="btn btn-w-m btn-warning" > 获取验证码 </button>
                    <button type="button"  class="btn btn-w-m btn-warning" disabled style="display: none">59s后重新获取</button>
                </section>
            </div>
            <hr>
        </div>
    </div>
</div>

<div id="achangeEle2" class="hide">
    <div class="mt20 ml20 mr20">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">新邮箱</label>
                <div class="col-sm-8">
                    <input class="form-control" id="email2" value="" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">验证码</label>
                <div class="col-sm-5">
                    <input class="form-control" id="codeEmail2" type="text">
                </div>
                <section class="col-sm-3">
                    <button type="button" id="sendBindingEmailCode" class="btn btn-w-m btn-warning" > 获取验证码 </button>
                    <button type="button"  class="btn btn-w-m btn-warning" disabled style="display: none">59s后重新获取</button>
                </section>
            </div>
            <hr>
        </div>
    </div>
</div>
<!--验证弹出框 结构 结束-->

<!--修改密码，弹出框，开始-->
<div id="newUpdatePassWord" class="hide">
    <form id="updateNewPasswordForm">
        <div class="mt20 ml20 mr20">
            <div class="form-horizontal">
                <div class="form-group">
                    <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">原密码</label>
                    <div class="col-sm-8">
                        <input class="form-control"  name="nowPwd" value="" type="password">
                        <p class="mt5"><span class="fs12 c-ccc">请输入原始密码</span></p>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">新密码</label>
                    <div class="col-sm-8">
                        <input class="form-control"  name="newPwd" value="" type="password">
                        <p class="mt5"><span class="fs12 c-ccc">建议使用字母、数字或两种及以上组合，6-20字符</span></p>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">新密码</label>
                    <div class="col-sm-8">
                        <input class="form-control"  name="confirmPwd" value="" type="password">
                        <p class="mt5"><span class="fs12 c-ccc">请输入新密码保持输入一致</span></p>
                    </div>
                </div>
                <hr>
            </div>
        </div>
    </form>
</div>
<!--修改密码，弹出框，开始-->

<!--验证弹手机出框 结构 开始-->
<div id="achangeMle1" class="hide">
    <div class="mt20 ml20 mr20">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">原手机</label>
                <div class="col-sm-8">
                    <input class="form-control" id="mobile1" disabled="disabled" th:value="${user['mobile']}" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">验证码</label>
                <div class="col-sm-5">
                    <input class="form-control" id="code1" type="text">
                </div>
                <section class="col-sm-3">
                    <button type="button" id="sendUnBindingCode" class="btn btn-w-m btn-warning"> 获取验证码 </button>
                    <button type="button" class="btn btn-w-m btn-warning" disabled style="display: none">59s后重新获取</button>
                </section>
            </div>
            <hr>
        </div>
    </div>
</div>

<div id="achangeMle2" class="hide">
    <div class="mt20 ml20 mr20">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">新手机</label>
                <div class="col-sm-8">
                    <input class="form-control" id="mobile2" value="" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label text-right unFw" style="padding-top: 0">验证码</label>
                <div class="col-sm-5">
                    <input class="form-control" id="code2" type="text">
                </div>
                <section class="col-sm-3">
                    <button type="button" id="sendBindingCode" class="btn btn-w-m btn-warning" > 获取验证码 </button>
                    <button type="button" class="btn btn-w-m btn-warning" disabled style="display: none">59s后重新获取</button>
                </section>
            </div>
            <hr>
        </div>
    </div>
</div>
<!--验证弹出框 结构 结束-->